<?php
use \yii\helpers\Url;

$this->title = '选择报告 ';
?>
<style>
    .wider{
        width: 180px;
    }
</style>
<div class="row">
    <div class="col-md-12">
        <img src="<?php echo Yii::$app->request->baseUrl.'/img/product_intro.gif';?>" width="100%">
    </div>
    <hr style="margin: 10px;border: none"/>
    <div class="col-md-12" style="margin-bottom: 20px">
        <h4><strong>我们提供以下不同版本供您选择:</strong></h4>
    </div>
    <div class="col-md-4 hidden" style="padding:0 40px">
        <div class="row" >
            <div class="col-md-12" style="border: 1px solid #f6f6f6">
                <a class="btn btn-primary btn-block" href="#" role="button" style="background-color:#269abc;font-size:large">体验版</a>
                <ul class="list-group" style="height:280px;background-color: #fff">
                    <li class="list-group-item" style="border: none"><strong>您将获得：</strong></li>
                    <li class="list-group-item" style="border: none">推广测评报告“概述”部分内容</li>
                    <li class="list-group-item" style="border: none"><small>（仅包括1个大类概述版内容）</small></li>
                    <li class="list-group-item" style="border: none">提问一定概率被回答</li>
                    <li class="list-group-item" style="border: none">推广方法订阅干货</li>
                </ul>
            </div>
            <div class="col-md-12 text-center">
                <a href="<?php echo Url::to(['free','paper_id'=>$paper_id,'product_id'=>$product_id])?>">
                    <button type="button"  class="btn btn-info wider">点击查看</button>
                </a>
            </div>
        </div>
        <hr>
    </div>
    <div class="col-md-4 col-md-offset-2" style="padding:0 40px">
        <div class="row" >
        <div class="col-md-12" style="border: 1px solid #f6f6f6">
            <a class="btn btn-primary btn-block" href="#" role="button" style="background-color:#269abc;font-size: large">专业版</a>
            <ul class="list-group" style="line-height:15px;height:220px;background-color: #fff;">
                <li class="list-group-item" style="border: none"><strong>您将获得以下内容：</strong></li>
                <li class="list-group-item" style="border: none">推广测评报告“概述”全部内容<br><small>（从8个大类，100+个小类，1000+个推广TIPS，从中精准匹配您的定制报告）</small></li>
                 <li class="list-group-item" style="border: none">推广测评报告“详细版”全部内容</li>
                <li class="list-group-item" style="border: none">提问大概率被回答</li>
                <li class="list-group-item" style="border: none"><strong>限时价：<span style="color: #c09411;font-size: 25px">299元</span></strong> 原价：699元</li>
            </ul>
        </div>
            <div class="col-md-12 text-center" >
                <?php $uid=Yii::$app->user->id;   //查询是否付费 如果已付费则可查看
                $result=\common\models\Shopcart::find()->where(['uid'=>$uid,'product_id'=>$product_id,'status'=>1])->one();
                if(!empty($result)){
                    echo "<a class='btn btn-info wider' href='result_back?paper_id=$paper_id&product_id=$product_id'>点击查看</a>";
                }else{
                    ?>
<!--                    <!-- Button trigger modal -->
<!--                    <button type="button" id="buy" class="btn btn-info wider" data-toggle="modal" data-target="#myModal">-->
<!--                        点击购买-->
<!--                    </button>-->
<!--                    <!-- Button trigger modal -->
<!--                    <button type="button" class="btn btn-success" data-toggle="modal" data-target="#myModal_card">-->
<!--                        M卡购买-->
<!--                    </button>-->

                    <div class="btn-group btn-group-justified" role="group" aria-label="...">
                        <div class="btn-group"  role="group">
                            <button type="button" id="buy"   class="btn btn-info" data-toggle="modal" data-target="#myModal">点击购买</button>
                        </div>
                        <div class="btn-group" role="group">
                            <button type="button"  id="try-use-card" class="btn btn-default" data-toggle="modal" data-target="#myModal_card" style="background-color: #00cc99;color: #fff">M卡购买</button>
                        </div>
                    </div>

                <?php } ?>
            </div>
        </div>
        <hr>
    </div>


    <div class="col-md-4" style="padding:0 40px">
        <div class="row">
        <div class="col-md-12" style="border: 1px solid #f6f6f6">
            <a class="btn btn-primary btn-block" href="#" role="button" style="background-color:#269abc;font-size: large">**版</a>
            <ul class="list-group" style="height:220px;background-color: #fff">
                <li class="list-group-item" style="border: none"><strong>努力开发中……</strong></li>
            </ul>
        </div>

            <div class="col-md-12 text-center">
                <button type="button"  class="btn btn-default wider">敬请期待</button>
            </div>
        </div>
        <hr>
    </div>
</div>
<hr>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button  type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel"> 微信支付</h4>
            </div>
            <div class="modal-body">
                <div class="row text-center pay-box">
                    <div class="col-md-6 col-xs-6 text-center"  id="qrcode">

                    </div>
                    <div class="col-md-6 text-center col-xs-6">
                        <img width="100%" src="<?php echo Yii::$app->request->baseUrl.'/img/exp.png'?>">
                    </div>
                </div>
                <div class="row text-center">
                    <p><small><span class="glyphicon glyphicon-exclamation-sign"></span>微信手机端，可长按识别二维码进行支付</small></p>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>


<!-- Modal -->
<div class="modal fade" id="myModal_card" tabindex="-1" role="dialog" aria-labelledby="myModalLabelCard">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabelCard">M卡充值</h4>
            </div>
            <div class="modal-body">
                <input type="text" class="form-control" placeholder="请输入M卡充值" id="card-content">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default close-model" data-dismiss="modal">关闭</button>
                <button type="button" id="use-card" class="btn btn-primary">确认</button>
            </div>
        </div>
    </div>
</div>



<script>
    var count=0;
    var wait=1000;
    var trade_no='';

    $(function(){
        $('#buy').click(function(){  //点击购买

            var product_id='<?php echo $product_id;?>';
            $.post('<?php echo Url::to(['pay/payment'])?>?product_id='+product_id,function(data){
                trade_no=data.obj.trade_no;
                var url=data.obj.url;
                var html='<img width="80%" src="<?php echo Yii::$app->request->baseUrl.'/img/shuo.png'?>">';
                html+='<img  src="<?php echo Url::to(['pay/qrcode'])?>?url='+url+'" width="100%" />';
                $('#qrcode').html(html);
                showTime(trade_no);
            });
        });
        $('#use-card').click(function(){//卡券使用
            var that=$(this);
            var card_num=$('#card-content').val();
           // alert(card_num);
            var paper_id="<?php echo $paper_id;?>";
            var product_id='<?php echo $product_id;?>';
            $.post('<?php echo Url::to(['pay/usecard'])?>?card_num='+card_num+'&product_id='+product_id,function(data){
            if(data=="yes"){
                var button='<a class="btn btn-info wider" href="<?php echo Url::to(['result_back'])?>?paper_id='+paper_id+'&product_id='+product_id+'">点击查看</a>';
                // buy.parent().append(button);
                that.parent().find('.close-model') .click();
                $('#try-use-card').closest('.col-md-12').html(button);
            }else{
                that.parent().find('.close-model') .click();
                alert('M卡号错误或已使用!');
            }
            });
        });
    });
    function showTime(trade_no)
    {
        if(count>600){   //若10分钟未响应  拉长循环间隔时间
            wait=wait*10;
        }
        var circle='';
        var paper_id="<?php echo $paper_id;?>";
        var product_id='<?php echo $product_id;?>';
        $.post('<?php echo Url::to(['pay/query'])?>?out_trade_no='+trade_no,function(data){
            //  alert(data.obj.trade_state);
            // alert(data);
            if(data!=''&&data.obj.trade_state=="SUCCESS"){
                var html='<img width="50%" src="<?php echo Yii::$app->request->baseUrl.'/img/ok.png'?>"  style="margin-top:60px">';
                html+='<p>支付成功！</p>';
                $('#qrcode').html(html);
                var buy=$('#buy');

               // buy.hide();
                var button='<a class="btn btn-info wider" href="<?php echo Url::to(['result_back'])?>?paper_id='+paper_id+'&product_id='+product_id+'">点击查看</a>';
               // buy.parent().append(button);
                buy.closest('.col-md-12').html(button);
                clearTimeout(circle);    //停止循环
            }
        });
        var temp= $("#myModal").is(":hidden");//是否隐藏
        // alert(temp);
        if(temp==true) {  //如果扫码框影藏 或者已支付成功  则停止循环
            clearTimeout(circle);
            return false;
        }
        else  circle=setTimeout("showTime(trade_no)", wait);
    }
</script>
